<script setup>
	import {
		onMounted,
		ref
	} from 'vue';
	import {
		useRoute
	} from 'vue-router'
	import {
		navigateBack,
	} from "@/assets/scripts/navigate.js"
	import {
		memorialHallApi,
	} from "@/assets/api/other/memorialHall.js"
	import {
		delApi,
	} from "@/assets/api/other/sacrificeForm.js"

	import sacrificeForm from '@/components/sacrificeForm.vue'

	const meMemorialId = ref('')
	const dataSource = ref({})

	const handleDelete = () => {
		uni.showModal({
			title: '温馨提示',
			content: "是否确认删除",
			success: async (e) => {
				if (e.confirm) {
					const res = await delApi(meMemorialId.value)
					if (res.code === 200) {
						uni.showToast({
							title: '删除成功',
							icon: 'success',
							duration: 2000,
							complete: () => {
								setTimeout(() => {
									navigateBack()
								}, 1000)
							}
						})
					} else {
						uni.showToast({
							title: '删除失败',
							icon: 'error',
						})
					}
				}
			}
		})
	}

	onMounted(() => {
		route_init() // 路由参数
		data_init() // 纪念馆数据
	})

	const route_init = () => {
		const route = useRoute()
		if (route.query.meMemorialId && route.query.meMemorialId !== 'undefined') {
			meMemorialId.value = route.query.meMemorialId
		}
	}

	const data_init = async () => {
		const res = await memorialHallApi(meMemorialId.value)
		if (res.code === 200) {
			dataSource.value = res.data
		}
	}
</script>

<template>
	<view class="">
		<uv-navbar :fixed="false" @leftClick="navigateBack" title="纪念馆设置">
			<template v-slot:right>
				<view class="d-flex d-flex-aic">
					<uv-icon name="trash" size="19" color="red"></uv-icon>
					<view class="ml-small del" @click="handleDelete">
						删馆
					</view>
				</view>
			</template>
		</uv-navbar>
		<sacrificeForm :data="dataSource" v-if="dataSource.id"></sacrificeForm>
	</view>
</template>

<style lang="scss" scoped>
	.del {
		color: red;
	}
</style>